/**
 * 图片浏览组件
 * 桑杨
 * 2018年12月27日15:15:48
 * 使用方法：
 * imgs 类型 Array 图片路径集合
 * selectItem 类型 string 当前图片路径
 * this.$KalixDialogImgPreview({
          imgs: this.imgs,
          selectItem: item
        })
    }
 */
import vue from 'vue'
import Unit from './Index.vue'

const UnitConstructor = vue.extend(Unit)

UnitConstructor.prototype.close = function () {
  let docKalixPopupMsg = document.querySelector('.kalix-dialog-img-preview--mask')
  docKalixPopupMsg.parentNode.removeChild(docKalixPopupMsg)
  // this.$el.parentNode.removeChild(this.$el)
}

/**
 * 显示组件
 * @param options
 */
function showMyPopupMsg(options = {}) {
  const unitDom = new UnitConstructor({
    el: document.createElement('div')
  })
  unitDom.imgs = options.imgs || []
  unitDom.selectItem = options.selectItem || {}
  unitDom.btnDefault = {
    text: '返回',
    event() {
      unitDom.close()
    }
  }
  unitDom.dialogInit()
  document.body.appendChild(unitDom.$el)
}

function registryUnit() {
  vue.prototype.$KalixDialogImgPreview = showMyPopupMsg
}

export default registryUnit
